<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
        <link type="text/css" rel="stylesheet" href="../style/avalon.doc.css"/>
        <script src="../avalon.js"></script>
        <script type="text/javascript">
            require(["dropdown/avalon.dropdown.js", "ready!"], function() {
                //multiple select vmodel
                avalon.define('mulSelect', function(vm) {
                    vm.$skipArray = ['opts'];
                    vm.opts = {
                        data: [
                            {
                                value: '1',
                                label: '1'
                            }, {
                                value: 2,
                                label: '2'
                            }, {
                                label: 'group1',
                                options: [
                                    {
                                        value: false,
                                        label: 'false'
                                    },
                                    {
                                        value: null,
                                        label: 'null'
                                    }
                                ]
                            }, {
                                label: 'group2',
                                options: [
                                    {
                                        value: '3',
                                        label: '3'
                                    }
                                ]
                            }
                        ],
                        multiple: true,
                        autofocus: true,
                        size: 4,
                        enable: false,
                        modleBind: true
                    };
                    vm.s2 = ['1', 2, null, false, '3'];
                });
                avalon.scan();
            });
        </script>
        <script src="../highlight/shCore.js"></script>
    </head>
    <body>
        <div class="wrapper">
            <div ms-controller="mulSelect">
                <h2>multiple select（多选下拉框）</h2>
                <p>使用option配置dropdown并使用双工绑定</p>
                <select ms-widget="dropdown,$,opts" ms-duplex="s2"></select>
                <p>{{s2}}</p>
            </div>
            <pre class="brush:html;gutter:false;toolbar:false;" ms-skip>
    &lt;!DOCTYPE html&gt;
    &lt;html&gt;
    &lt;head&gt;
        &lt;title&gt;&lt;/title&gt;
        &lt;meta charset="UTF-8"&gt;
        &lt;meta name="viewport" content="width=device-width"&gt;
        &lt;script src="../avalon.js"&gt;&lt;/script&gt;
        &lt;script type="text/javascript"&gt;
         require(["dropdown/avalon.dropdown.js", "ready!"], function() {
                //multiple select vmodel
                avalon.define('mulSelect', function(vm) {
                    vm.$skipArray = ['opts'];
                    vm.opts = {
                        data: [
                            {
                                value: '1',
                                label: '1'
                            }, {
                                value: 2,
                                label: '2'
                            }, {
                                label: 'group1',
                                options: [
                                    {
                                        value: false,
                                        label: 'false'
                                    },
                                    {
                                        value: null,
                                        label: 'null'
                                    }
                                ]
                            }, {
                                label: 'group2',
                                options: [
                                    {
                                        value: '3',
                                        label: '3'
                                    }
                                ]
                            }
                        ],
                        multiple: true,
                        autofocus: true,
                        size: 4,
                        enable: false,
                        modleBind: true
                    };
                    vm.s2 = ['1', 2, null, false, '3'];
                });
                avalon.scan();
            });
        &lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
    &lt;div ms-controller="mulSelect"&gt;
        &lt;h2&gt;multiple select（多选下拉框）&lt;/h2&gt;
        &lt;p&gt;使用option配置dropdown并使用双工绑定&lt;/p&gt;
        &lt;select ms-widget="dropdown,$,opts" ms-duplex="s2"&gt;&lt;/select&gt;
        &lt;p&gt;{{s2}}&lt;/p&gt;
    &lt;/div&gt;
    &lt;/body&gt;
    &lt;/html&gt;
            </pre>
        </div>
    </body>
</html>